<div>
    <div style="width: 450px;height: 450px;border:1px solid #ddd;float: left;">
        <div style="margin:183px 151px;" id="uploadDiv">
           <span class="btn btn-default" style="position: relative;overflow: hidden;">
               <i class="fa fa-plus"></i>
               <span>选择图片</span>
               <input id="fileInput" type="file" class="fileInput"
                      style=" position:absolute;right:0;top: 0;margin: 0;opacity: 0;font-size: 300px;cursor: pointer;">
           </span>
        </div>
        <img id="previewPic" style="max-width: 450px;max-height: 450px;vertical-align: middle;" class="picture"/>
    </div>

    <div style="width: 200px;height: 450px; background-color: #F6F3F3;float: left;margin-left: 20px;">
        <table width="200px">
            <tbody>
            <tr>
                <td style="text-align: center">
                    <div style="padding: 5px;display: inline-block;font-weight: bold;color: #4B515D">预览</div>
                </td>
            </tr>
            <tr>
                <td style="text-align: center">
                    <div style="width: 180px;height: 180px;overflow: hidden;display:inline-block">
                        <img src="" id="largePicture" class="picture"/>
                    </div>
                </td>
            </tr>
            <tr>
                <td style="padding: 2px;text-align: center;">
                    <span style="font-size: 12px;color: #808080">大尺寸180*180</span>
                </td>
            </tr>
            <tr>
                <td style="text-align: center">
                    <div style="width: 90px;height: 90px;overflow: hidden; display: inline-block">
                        <img src="" id="middlePicture" class="picture"/>
                    </div>
                </td>
            </tr>
            <tr>
                <td style="padding: 2px;text-align: center;">
                    <span style="font-size: 12px;color: #808080">中尺寸90*90</span>
                </td>
            </tr>
            <tr>
                <td style="text-align: center">
                    <div style="width: 60px;height: 60px;overflow: hidden; display: inline-block">
                        <img src="" id="smallPicture" class="picture"/>
                    </div>
                </td>
            </tr>
            <tr>
                <td style="padding: 2px;text-align: center;">
                    <span style="font-size: 12px;color: #808080">小尺寸60*60</span>
                </td>
            </tr>
            </tbody>
        </table>
    </div>
    <div class="clearfix"></div>
    <div style="margin-top: 5px;">
        <div id="reUploadDiv" style="display: none;">
           <span class="btn btn-default" style="position: relative;overflow: hidden;">
               <i class="fa fa-undo"></i>
               <span>重新上传</span>
               <input id="reUpload" type="file" class="fileInput"
                      style=" position:absolute;right:0;top: 0;margin: 0;opacity: 0;font-size: 300px;cursor: pointer;">
           </span>
        </div>
    </div>
    <img src="" style="display: none;" id="originalPic" class="picture">
</div>

